<?php ?>

<div id="example" class="k-content">
    <div id="grid"></div>
    <div id="confirmar"></div>
    <div id="rechazar"></div>
    <script>
        var wndC, wndR, confirmarTemplate, rechazarTemplate, edo_material;
        var rutaRech = "<?php echo $this->Html->Url(array('controller' => 'ordenes', 'action' => 'rechaza')); ?>";
        var rutaConf = "<?php echo $this->Html->Url(array('controller' => 'ordenes', 'action' => 'confirma')); ?>";
        
        $(document).ready(function () {
            dataSource = new kendo.data.DataSource({
                transport: {
                    read:{
                        url: "<?php echo $this->Html->Url(array('controller' => 'ordenes', 'action' => 'consultaConfirmacion')); ?>",
                        dataType: "json"
                    },
                    parameterMap: function(options, operation) {
                        if (operation !== "read" && options.models) {
                            return {models: kendo.stringify(options.models)};
                        }
                    }
                },
                batch: true,
                pageSize: 20,
            });
            function estado(item) {
                switch(item.estado) {
                    case "2": return "En Espera";
                }
            }
            function estadoMaterial(item) {
                switch(item.edo_material) {
                    case "0": return "No Requiere";
                    case "1": return "No Existe";
                    case "2": return "Existe";
                }
            }
            $("#grid").kendoGrid({
                dataSource: dataSource,
                pageable: true,
                height: 430,
                columns: [
                    { field: "folio", title:"Folio", width: "100px" },
                    { field: "descripcion", title:"Descripcion", width: "150px" },
                    { field: "observaciones", title:"Observaciones", width: "150px" },
                    { field: "estado", title:"Estado", width: "100px" , template: estado},
                    { field: "edo_material", title:"Material", width: "100px", template: estadoMaterial},
                    { field: "fecha", title:"Fecha", width: "100px" },
                    { field: "id_asesor", title:"Asesor", width: "100px" },
                    { field: "id_cliente", title:"Cliente", width: "100px" },
                    { field: "id_ing", title:"Ingeniero", width: "100px" },
                    { command: [{text: "Confirmar", click: dialogoConfirmar}, {text: "Rechazar", click: dialogoRechazar}], title: "&nbsp;", width: "100px" }]
            });
            
            wndC = $("#confirmar").kendoWindow({
                    title: "Confirmar",
                    modal: true,
                    visible: false,
                    resizable: false,
                    width: 300
                }).data("kendoWindow");

            confirmarTemplate = kendo.template($("#templateConfirmar").html());
            
            wndR = $("#rechazar").kendoWindow({
                    title: "Rechazar",
                    modal: true,
                    visible: false,
                    resizable: false,
                    width: 300
                }).data("kendoWindow");

            rechazarTemplate = kendo.template($("#templateRechazar").html());
        });
        
        function dialogoConfirmar(e) {
            e.preventDefault();
            var dataItem = this.dataItem($(e.currentTarget).closest("tr"));
            edo_material = dataItem["edo_material"];
            wndC.content(confirmarTemplate(dataItem));
            wndC.center().open();
        }
        
        function dialogoRechazar(e) {
            e.preventDefault();
            var dataItem = this.dataItem($(e.currentTarget).closest("tr"));
            wndR.content(rechazarTemplate(dataItem));
            wndR.center().open();
        }
        
        function confirmado(id_orden) {
            var observacion = $("#obsC").val();
            wndC.center().close();
            $.post(rutaConf,{id_orden : id_orden,edo_material:edo_material,observaciones:observacion},recargar);
        }
        
        function rechazado(id_orden) {
            var observacion = $("#obsR").val();
            
            wndR.center().close();
            $.post(rutaRech,{id_orden : id_orden,observaciones:observacion},recargar);
        }
        
        function recargar()
        {
            var grid = $("#grid").data("kendoGrid");
            grid.dataSource.read();
        }
    </script>
    
    <script type="text/x-kendo-template" id="templateConfirmar">
        <div id="confirmar-container">
            <h2>Orden: #= folio #</h2>
            <em>Observaciones:</em>
            <textarea id="obsC"></textarea>
            <input class="botonFormVentanita" type="button" value="Confirmar" onclick="confirmado(#= id #, #= edo_material #);"></input>
        </div>
    </script>
    
    <script type="text/x-kendo-template" id="templateRechazar">
        <div id="rechazar-container">
            <h2>Orden: #= folio #</h2>
            <em>Observaciones:</em>
            <textarea id="obsR"></textarea>
            <input class="botonFormVentanita" type="button" value="Rechazar" onclick="rechazado(#= id #);"></input>
        </div>
    </script>
</div>